<template>
	<view class="bigBox">

		<view class="infomation">

			<!-- <view class="infoTitle">
				<view class="tip"></view>
				<view>领取代金券规则：</view>
			</view> -->

			<view class="infoTextBox">
				<view class="infoText">
					活动编号:{{ act_no }}</br>
					手机号:{{ phone }}</br>
				</view>
				
			</view>
			<!-- <view style="width:600rpx;word-wrap: break-word;">手机号：{{ phone }}</view> -->
			<!-- <view style="width:600rpx;word-wrap: break-word;">code:{{ code }}</view> -->
			
			<!-- <view class="chouTitle" @click="testBtn">
				领取奖励
			</view> -->



		</view>
	<xl-packet 
     :show="show"
	 :money="money"
      @close="close"
      @change="openBtn">
  </xl-packet>
		
		<!-- <view class="infomation">

			<view class="infoTitle">
				<view class="tip"></view>
				<view>代金券使用说明：</view>
			</view>

			<view class="infoTextBox">
				<view class="infoText">
					1.代金券只能一次性使用，不可重复使用。</br>
					2.如您退货或取消订单，您将无法再次使用该代金券。</br>
					3.代金券如有任何疑问，请咨询客服人员。</br>
				</view>
			</view>

		</view> -->

	</view>
</template>

<script>
import xlPacket from '@/components/xl-packet/xl-packet.vue'
	export default {
		components: {
   xlPacket
},
	data() {
		return {
			show:true,
			act_no:"",
			APPID: "wx089c69996038e4be",
			SCOPE: "snsapi_userinfo",
			// SECRET: "2dc8ae44c6c8815fa2fc522fdb6028bb",
			phone: "",
			code: "",
			money:"╮(๑•́ ₃•̀๑)╭",
			getAmtData:{}
		
		}
	},
	onShow() {
		
		uni.request({
				url: 'https://api.yunzb123.com/merchantElectronicCouponWLAct/getActNo', // 你的API地址
				method: 'GET',
				success: (res)=> {
					// console.log(res.data);
					this.act_no  = res.data.msg
					let getPhone = this.getParams();
					this.phone = getPhone.phone;
					this.startCallBack()
				},
				fail:  (err)=> {
					console.log(err);
				},
			});
			
	},
	methods: {
		openBtn() {
			uni.showLoading();
			uni.request({
				url: 'https://api.yunzb123.com/merchantElectronicCouponWLAct/send', // 你的API地址
				method: 'POST',
				data:this.getAmtData,
				success:  (res)=> {
					uni.hideLoading();
					if( res.data.code == "00"){
						this.money = res.data.msg
					}else{
						this.money = res.data.msg
					}
						
						
					
				},
				fail:  (err)=> {
					uni.hideLoading();
					console.log(err);
					this.money = "err"
				},
				
			});
		},
		getParams() {
			// 获取跳转回来的参数，里面包含了我们需要的code
			var url = window.location.search;
			var objParams = new Object();
			if (url.indexOf("?") != -1) {
				var str = url.substr(1);
				var strs = str.split("&");
				for (var i = 0; i < strs.length; i++) {
					objParams[strs[i].split("=")[0]] = strs[i].split("=")[1];
				}
			}
			return objParams;
		},
		authenticatedLogin() {
			// 微信公众号或企业微信的appid
			let APPID = this.APPID;
			// 跳转回来的路径
			let REDIRECT_URI = encodeURIComponent(
				"https://voucher.yunzb123.com?phone=" + this.phone
			);
			// 拿用户的某种信息
			let SCOPE = this.SCOPE
			// 微信公众号或者企业微信的请求地址
			location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${APPID}&redirect_uri=${REDIRECT_URI}&response_type=code&scope=${SCOPE}&state=STATE#wechat_redirect `;
			return;
		},
		startCallBack() {
			let getCode = this.getParams();
			this.code = getCode.code;
			this.phone = getCode.phone;
			// 获取code 如果没有就走微信公众号或者企业微信的请求链接，如果有就走后续流程
			if (this.code) {
				this.getAmtData = {
					code:this.code,
					phone_no:this.phone,
					act_id:this.act_no

				}
			
			} else {
				this.authenticatedLogin();
			}

		},
	}
}
</script>
<style lang="scss">
page {
	background: #fff;
	height: 100vh;

}

.bigBox {
	height: 100vh;
	background: url('../static/images/hbbg.jpg');
	// background: red;

	.chouTitle {
		text-align: center;
		font-size: 64rpx;
	}

	.infomation {
		padding: 26rpx 0;

		color: #f3f3f3;

		.infoTitle {
			width: 100%;
			padding: 0 40rpx;
			font-size: 26rpx;
			font-weight: 500;
			display: flex;


			.tip {
				width: 6rpx;
				height: 22rpx;
				background: #f3f3f3;
				margin-top: 6rpx;
				margin-right: 28rpx;
			}
		}

		.infoTextBox {
			padding: 0 70rpx;

			.infoText {
				padding: 20rpx 0rpx;
				font-size: 24rpx;
				line-height: 1.6;
				margin-bottom: 20rpx;

			}
		}

	}
}
</style>